<!-- 列表 -->
<template>
  <div>
    <el-form class="const_top" :model="queryParams" size="small" :inline="true">
      <el-row>
        <el-col v-if="radio == 1" :span="18">
          <el-form-item prop="" style="height: 40px">
            <el-date-picker
              clearable
              v-model="queryParams.createdTime"
              type="month"
              placeholder="选择月"
              @change="createdTimeChange"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-select
              v-model="queryParams.seq"
              placeholder="1号至10号"
              clearable
              :disabled="mount"
              @clear="clearOpen"
            >
              <el-option
                v-for="dict in NewDropDownList"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.stapCode"
              placeholder="物料编码"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.stapName"
              placeholder="物料名称"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.empName"
              placeholder="盘点人"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>

          <el-button type="primary" size="mini" @click="handleQuery"
            >查询
          </el-button>
        </el-col>
        <el-col v-else :span="18">
          <el-form-item prop="" style="height: 40px">
            <el-date-picker
              clearable
              v-model="queryParams.date"
              type="date"
              placeholder="日期"
              format="yyyy-MM-dd"
              @change="createdTimeChangeRadio"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.createBy"
              placeholder="操作人"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.fbillno"
              placeholder="单据编号"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item prop="" style="height: 40px">
            <el-input
              v-model="queryParams.fmaterialIdfnumber"
              placeholder="物料编码"
              clearable
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>

          <el-button type="primary" size="mini" @click="handleQuery"
            >查询
          </el-button>
        </el-col>
      </el-row>
    </el-form>
    <el-table :data="dataChangeList">
      <el-table-column align="center" label="序号" type="index" width="50">
      </el-table-column>
      <el-table-column
        v-for="(item, index) in dataOne"
        :key="index"
        :label="item.name"
        :prop="item.prop"
        align="center"
      >
        <!-- <template slot-scope="scope">{{ scope.row.date }}</template> -->
      </el-table-column>
    </el-table>
    <pagination
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getdataList"
    />
  </div>
</template>

<script>
import {
  outchangepage,
  getEndInventory,
  getDropDown,
} from "@/api/system/stock.js";
export default {
  props: {
    dataOne: {
      type: Array,
      default: () => [],
    },
    radio: {},
  },
  data() {
    return {
      // key: value,
      examineOption: [],
      loading: true,
      total: 0,
      mount: true,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      byMonth: "",
      dataChangeList: [],
      // 盘点阶段
      DropDownList: [],
      // 处理后的盘点阶段
      NewDropDownList: [],
    };
  },
  watch: {
    radio(newValue, oldValue) {},
  },
  created() {
    this.getdataList();
  },
  methods: {
    getdataList() {
      if (this.radio == 1) {
        getEndInventory(this.queryParams).then((res) => {
          if (res.code == 200) {
            this.dataChangeList = res.rows;
            this.total = res.total;
            this.loading = false;
          }
        });
      } else {
        outchangepage(this.queryParams).then((res) => {
          if (res.code == 200) {
            this.dataChangeList = res.rows;
            this.total = res.total;
            this.loading = false;
          }
        });
      }
    },
    createdTimeChange(v) {
      let data = new Date(v);
      let y = data.getFullYear();
      let m = data.getMonth() + 1;
      this.byMonth = y + String(m).padStart(2, "0");
      getDropDown(this.byMonth).then((res) => {
        if (res.code == 200) {
          this.DropDownList = res.data;
          this.NewDropDownList = [];
          this.DropDownList.forEach((element) => {
            let label =
              element.startTime.split("-")[2] +
              "号-" +
              element.endTime.split("-")[2] +
              "号";

            this.NewDropDownList.push({
              value: element.seq,
              label: label,
            });
            if (res.data != []) {
              this.mount = false;
            }
          });
        }
      });
    },
    createdTimeChangeRadio(V) {
      const originalDate = new Date(V);
      const year = originalDate.getFullYear();
      const month = String(originalDate.getMonth() + 1).padStart(2, "0"); // 月份从0开始，需要加1
      const day = String(originalDate.getDate()).padStart(2, "0");
      // 拼接成目标格式的日期字符串
      this.queryParams.date = `${year}-${month}-${day}`;
    },
    handleQuery() {
      if (this.radio == 1) {
        let arr = this.DropDownList.filter(
          (item) => item.seq == this.queryParams.seq
        );
        this.queryParams = { ...this.queryParams, ...arr[0] };

        getEndInventory(this.queryParams).then((res) => {
          if (res.code == 200) {
            this.dataChangeList = res.rows;
            this.total = res.total;
          }
        });
      } else {
        this.queryParams;
        console.log(this.queryParams);
        outchangepage(this.queryParams).then((res) => {
          if (res.code == 200) {
            this.dataChangeList = res.rows;
            this.total = res.total;
          }
        });
      }
    },
    clearOpen() {
      delete this.queryParams.seq;
      delete this.queryParams.startTime;
      delete this.queryParams.endTime;
    },
  },
};
</script>

<style lang="scss" scoped></style>
